<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@include file="common/header.jsp"%>
        <div class="right">
            <div class="location">
                <strong>你现在所在的位置是:</strong>
                <span>用户管理页面</span>
            </div>
            <!--用户-->
            <div style="display:none;">
             <c:forEach var="permis" items="${permisList }" >
             <dl>
             	<dt><label><input type="checkbox">${permis.description }</label></dt>
             	<dd>
             <c:forEach var="subPerm" items="${permis.subPermis }" >
             	 <label>
             	 <input class="permisChb" name="permId" type="checkbox" value="${subPerm.id }" <c:if test="${subPerm.roleId != 0 }"> checked="checked"</c:if>>
             	 	${subPerm.description }
             	 </label>
				</c:forEach>
             	</dd>
             </dl>
             </c:forEach>
             </div>
			<ul id="treeDemo" class="ztree"></ul>
             <a href="javascript:;" class="getzTree">获取zTree选中的值</a>
			<input type="hidden" class="roleId" value="${id }">
			<div class="search"><a href="javascript:;">保存</a></div>
        </div>
    </section>


	<link rel="stylesheet" href="${pageContext.request.contextPath }/statics/zTree_v3/css/zTreeStyle/zTreeStyle.css" type="text/css">
<%@include file="common/footer.jsp" %>
	<script type="text/javascript" src="${pageContext.request.contextPath }/statics/zTree_v3/js/jquery.ztree.core.js"></script>
	<script type="text/javascript" src="${pageContext.request.contextPath }/statics/zTree_v3/js/jquery.ztree.excheck.js"></script>
<script type="text/javascript">

    var setting = {
		check: {
			enable: true
		},
		data: {
			key:{
				name:"description"//显示的属性 默认name
			},
			simpleData: {
				enable: true
			}
		}
	};
	var zNodes = [];
	var zTree = {}; 
	/* [
		{ id:1, pId:6, name:"用户查询"},
		{ id:2, pId:6, name:"用户添加"},
		{ id:3, pId:6, name:"更新用户"},
		{ id:4, pId:6, name:"获取用户"},
		{ id:5, pId:7, name:"供应商查询"},
		{ id:6, pId:0, name:"用户管理",open:true},
		{ id:7, pId:0, name:"供应商管理",open:true},
	]; */
	
$(function(){
	
	$.ajax({
		url:"${pageContext.request.contextPath}/role/permission",
		type:"POST",
		data:{"roleId":$(".roleId").val()},
		dataType:"JSON",
		success:function(data){
			for(var i in data){
				if(data[i].pid == 0){
					//如果是一级默认打开
					data[i].open = true;
				}else if(data[i].roleId != 0 ){
					//如果角色id不是0说明有该权限
					data[i].checked = true;
				}else{
					data[i].checked = false;
				}
				zNodes[i] = data[i];
				//zTree默认关联属性是pId, 
				//1.由于区分大小写所有这里使用代码添加pId 
				//2.可以在实体类中添加pId属性
				zNodes[i].pId = zNodes[i].pid;
			}
			//初始化
			zTree = $.fn.zTree.init($("#treeDemo"), setting, zNodes);
		},
		error:function(){
			alert("初始化权限失败!");
		}
	})
	
	$(".getzTree").click(function(){
		var data = zTree.getCheckedNodes(true)
		console.log(data)
	})
	
	$(".search a").click(function(){
		var num = zTree.getCheckedNodes(true);
		var test = "";
		for (var i = 0; i < num.length; i++) {
			if (num[i].isParent != true) {
				test += num[i].id;
				alert(test);
				if (num[i + 1] != null) {
					test += ",";
				}
			}
		}
		/* alert(test);
		
		var data = $(".permisChb:checked").serialize();
		data +="&roleId=" + $(".roleId").val(); */
		
		$.ajax({
			url:"${pageContext.request.contextPath}/role/auth",
			type:"POST", 
			data:{roleId:$(".roleId").val(),
				data:test
			},
			dataType:"JSON",
			success:function(data){
				if(data){
					alert("修改成功!");
					location.href = "${pageContext.request.contextPath}/role/list";
				}
			},
			error:function(){
				alert("修改失败!");
			}
		})
	})
	
})

</script>